import 'package:flutter/material.dart';
import 'package:yp/helper.dart';
import 'package:get/get.dart';

import 'logic.dart';
import 'state.dart';

class InvoiceDetailsPage extends StatefulWidget {

  @override
  State<StatefulWidget> createState() {
    return _InvoiceDetailsPage();
  }
}

class _InvoiceDetailsPage extends State<InvoiceDetailsPage> {
  final InvoiceDetailsLogic logic = Get.put(InvoiceDetailsLogic());
  final InvoiceDetailsState state = Get.find<InvoiceDetailsLogic>().state;

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        centerTitle: true,
        backgroundColor: Colors.white,
        elevation: setWidth(1),
        title: Text(
          '发票详情',
          style: TextStyle(
            color: Color(0xff020202),
            fontSize: 17,
            fontWeight: FontWeight.bold,
          ),
        ),
        iconTheme: IconThemeData(
          color: Color(0xff020202),
        ),
      ),
      body: GetBuilder<InvoiceDetailsLogic>(
        builder: (logic) {
          return Container(
            child: ListView.separated(
              itemBuilder: (context, index) {
                if (index == 0) {
                  return _invoiceInformationWidget();
                }
                return _invoiceStatusWidget();
              },
              separatorBuilder: (context, index) {
                return SizedBox(height: setWidth(20));
              },
              itemCount: 2,
            ),
          );
        },
      ),
    );
  }

  Widget _invoiceInformationWidget() {
    return Container(
      color: Colors.white,
      padding: EdgeInsets.only(
        left: setWidth(32),
        top: setWidth(12),
      ),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          // 发票状态
          Padding(
            padding: EdgeInsets.only(
              right: setWidth(24),
            ),
            child: Row(
              children: [
                Container(
                  width: setWidth(150),
                  height: setWidth(86),
                  alignment: Alignment.centerLeft,
                  child: Text(
                    '发票状态',
                    style: TextStyle(
                      color: Color(0xff717171),
                      fontSize: 14,
                    ),
                  ),
                ),
                Expanded(
                  child: Container(
                    height: setWidth(86),
                    alignment: Alignment.centerLeft,
                    child: Text(
                      '已开票',
                      maxLines: 1,
                      overflow: TextOverflow.ellipsis,
                      style: TextStyle(
                        color: Color(0xffCBB397),
                        fontSize: 14,
                      ),
                    ),
                  ),
                ),
              ],
            ),
          ),
          Divider(
            height: setWidth(1),
            indent: 0,
            endIndent: 0,
            color: Color(0xffEFEFEF),
          ),
          // 发票类型
          Padding(
            padding: EdgeInsets.only(
              right: setWidth(24),
            ),
            child: Row(
              children: [
                Container(
                  width: setWidth(150),
                  height: setWidth(86),
                  alignment: Alignment.centerLeft,
                  child: Text(
                    '发票类型',
                    style: TextStyle(
                      color: Color(0xff717171),
                      fontSize: 14,
                    ),
                  ),
                ),
                Expanded(
                  child: Container(
                    height: setWidth(86),
                    alignment: Alignment.centerLeft,
                    child: Text(
                      '纸质发票',
                      maxLines: 1,
                      overflow: TextOverflow.ellipsis,
                      style: TextStyle(
                        color: Color(0xff222222),
                        fontSize: 14,
                      ),
                    ),
                  ),
                ),
              ],
            ),
          ),
          Divider(
            height: setWidth(1),
            indent: 0,
            endIndent: 0,
            color: Color(0xffEFEFEF),
          ),
          // 发票抬头
          Padding(
            padding: EdgeInsets.only(
              right: setWidth(24),
            ),
            child: Row(
              children: [
                Container(
                  width: setWidth(150),
                  height: setWidth(86),
                  alignment: Alignment.centerLeft,
                  child: Text(
                    '发票抬头',
                    style: TextStyle(
                      color: Color(0xff717171),
                      fontSize: 14,
                    ),
                  ),
                ),
                Expanded(
                  child: Container(
                    height: setWidth(86),
                    alignment: Alignment.centerLeft,
                    child: Text(
                      '个人',
                      maxLines: 1,
                      overflow: TextOverflow.ellipsis,
                      style: TextStyle(
                        color: Color(0xff222222),
                        fontSize: 14,
                      ),
                    ),
                  ),
                ),
              ],
            ),
          ),
          Divider(
            height: setWidth(1),
            indent: 0,
            endIndent: 0,
            color: Color(0xffEFEFEF),
          ),
          // 订单状态
          Padding(
            padding: EdgeInsets.only(
              right: setWidth(24),
            ),
            child: Row(
              children: [
                Container(
                  width: setWidth(150),
                  height: setWidth(86),
                  alignment: Alignment.centerLeft,
                  child: Text(
                    '订单状态',
                    style: TextStyle(
                      color: Color(0xff717171),
                      fontSize: 14,
                    ),
                  ),
                ),
                Expanded(
                  child: Container(
                    height: setWidth(86),
                    alignment: Alignment.centerLeft,
                    child: Text(
                      '已完成',
                      maxLines: 1,
                      overflow: TextOverflow.ellipsis,
                      style: TextStyle(
                        color: Color(0xff222222),
                        fontSize: 14,
                      ),
                    ),
                  ),
                ),
              ],
            ),
          ),
          Divider(
            height: setWidth(1),
            indent: 0,
            endIndent: 0,
            color: Color(0xffEFEFEF),
          ),
          // 收票人
          Padding(
            padding: EdgeInsets.only(
              right: setWidth(24),
            ),
            child: Row(
              children: [
                Container(
                  width: setWidth(150),
                  height: setWidth(86),
                  alignment: Alignment.centerLeft,
                  child: Text(
                    '收票人',
                    style: TextStyle(
                      color: Color(0xff717171),
                      fontSize: 14,
                    ),
                  ),
                ),
                Expanded(
                  child: Container(
                    height: setWidth(86),
                    alignment: Alignment.centerLeft,
                    child: Text(
                      '某某某 138172263551',
                      maxLines: 1,
                      overflow: TextOverflow.ellipsis,
                      style: TextStyle(
                        color: Color(0xff222222),
                        fontSize: 14,
                      ),
                    ),
                  ),
                ),
              ],
            ),
          ),
          Divider(
            height: setWidth(1),
            indent: 0,
            endIndent: 0,
            color: Color(0xffEFEFEF),
          ),
          // 收票地址
          Padding(
            padding: EdgeInsets.only(
              top: setWidth(22),
              right: setWidth(24),
              bottom: setWidth(22),
            ),
            child: Row(
              crossAxisAlignment: CrossAxisAlignment.start,
              children: [
                Container(
                  width: setWidth(150),
                  alignment: Alignment.centerLeft,
                  child: Text(
                    '收票地址',
                    style: TextStyle(
                      color: Color(0xff717171),
                      fontSize: 14,
                    ),
                  ),
                ),
                Expanded(
                  child: Text(
                    '江苏省苏州市昆山花桥国际商务城 云桥路 118号浦江大厦3号楼',
                    style: TextStyle(
                      color: Color(0xff222222),
                      fontSize: 14,
                    ),
                  ),
                ),
              ],
            ),
          ),
          Divider(
            height: setWidth(1),
            indent: 0,
            endIndent: 0,
            color: Color(0xffEFEFEF),
          ),
          // 发票内容
          Padding(
            padding: EdgeInsets.only(
              right: setWidth(24),
            ),
            child: Row(
              children: [
                Container(
                  width: setWidth(150),
                  height: setWidth(86),
                  alignment: Alignment.centerLeft,
                  child: Text(
                    '发票内容',
                    style: TextStyle(
                      color: Color(0xff717171),
                      fontSize: 14,
                    ),
                  ),
                ),
                Expanded(
                  child: Container(
                    height: setWidth(86),
                    alignment: Alignment.centerLeft,
                    child: Text(
                      '商品明细',
                      maxLines: 1,
                      overflow: TextOverflow.ellipsis,
                      style: TextStyle(
                        color: Color(0xff222222),
                        fontSize: 14,
                      ),
                    ),
                  ),
                ),
              ],
            ),
          ),
        ],
      ),
    );
  }

  Widget _invoiceStatusWidget() {
    return Container(
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          Container(
            height: setWidth(88),
            color: Colors.white,
            padding: EdgeInsets.only(
              left: setWidth(32),
              right: setWidth(20),
            ),
            child: InkWell(
              onTap: () {
                print('查看发票 点击事件！！！！');
              },
              child: Row(
                mainAxisAlignment: MainAxisAlignment.spaceBetween,
                crossAxisAlignment: CrossAxisAlignment.center,
                children: [
                  Expanded(
                    child: Text(
                      '查看发票',
                      maxLines: 1,
                      overflow: TextOverflow.ellipsis,
                      style: TextStyle(
                        color: Color(0xff222222),
                        fontSize: 14,
                      ),
                    ),
                  ),
                  SizedBox(width: setWidth(20)),
                  Image.asset(
                    'assets/images/arrow_right.png',
                    width: setWidth(12),
                    height: setWidth(30),
                    fit: BoxFit.cover,
                  ),
                ],
              ),
            ),
          ),
          SizedBox(height: setWidth(2)),
          Container(
            height: setWidth(88),
            color: Colors.white,
            padding: EdgeInsets.only(
              left: setWidth(32),
              right: setWidth(20),
            ),
            child: InkWell(
              onTap: () {
                print('授权点击事件！！！！！');
              },
              child: Row(
                mainAxisAlignment: MainAxisAlignment.spaceBetween,
                crossAxisAlignment: CrossAxisAlignment.center,
                children: [
                  Expanded(
                    child: Text(
                      '授权激荡网络将普通电子发票加入微信卡包',
                      maxLines: 1,
                      overflow: TextOverflow.ellipsis,
                      style: TextStyle(
                        color: Color(0xff222222),
                        fontSize: 14,
                      ),
                    ),
                  ),
                  SizedBox(width: setWidth(20)),
                  Image.asset(
                    'assets/images/arrow_right.png',
                    width: setWidth(12),
                    height: setWidth(30),
                    fit: BoxFit.cover,
                  ),
                ],
              ),
            ),
          ),
        ],
      ),
    );
  }
}